<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/jsp/taglib.jsp"%>
<%@page import="com.framework.utils.ConfigUtil"%>
<!DOCTYPE html>
<html>
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>信息编辑窗体</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

   <link href="${ctxStatic}/plugins/h+/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/animate.min.css" rel="stylesheet">
    <%--<link href="${ctxStatic}/plugins/h+/css/style.min862f.css?v=4.1.0" rel="stylesheet">--%>
    <link rel="stylesheet" type="text/css" href="${ctxStatic}/plugins/h+/css/plugins/webuploader/webuploader.css">
    <link href="${ctxStatic}/plugins/h+/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">

    <link href="${ctxStatic}/plugins/h+/css/font-awesome.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/chosen/chosen.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/colorpicker/css/bootstrap-colorpicker.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/cropper/cropper.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/switchery/switchery.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/jasny/jasny-bootstrap.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/nouslider/jquery.nouislider.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/datapicker/datepicker3.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/ionRangeSlider/ion.rangeSlider.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/ionRangeSlider/ion.rangeSlider.skinFlat.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/plugins/clockpicker/clockpicker.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/animate.min.css" rel="stylesheet">
    <link href="${ctxStatic}/plugins/h+/css/style.min.css?v=4.0.0" rel="stylesheet"><base target="_blank">

<style>
    .dtupload>img{
        width: 54px;
        padding-left: 39px;
        padding-top: 16px;
    }
    .dtupload>a{
        color: #268eff;
        font-size: 12px;
        position: relative;
        left: 26px;
        top: 10px;
    }.dtupload>a:hover,
     .shoplogo>a:hover{
         color:#F93;
     }.upload_pic {
          height: 70px;
          width:70px;
          position: relative;
          cursor: pointer;
          color: #ccbe9e;
          background: #fff;
          overflow: hidden;
          display: inline-block;
          *display: inline;
          *zoom: 1;
      }
    .upload_pic input {
        position: absolute;
        height:100%;
        width:100%;
        right: 0;
        top: 0;
        opacity: 0;
        filter: alpha(opacity=0);
        cursor: pointer
    }
    .upload_pic:hover {
        color: #ccbe9e;
        background: #fff;
        text-decoration: none
    }
    ul,li{
        list-style:none;
    }
    .minussapn,.plussapn{
        cursor:pointer;
        font-size:20px;
        color:#ff503e;
        margin-left:10px;
    }
    .newplussapn{
        font-size:16px;
        margin-left:10px;
        color:#fff;
        display:inline-block;
        padding:0 5px;
        border-radius:4px;
        background-color:#0f91d3;
        cursor:pointer;
    }
    .span-add{
        color:#0f91d3;
        cursor:pointer;
    }
    .picsup{
        margin:10px 0;
        display:none;
    }
    .addpicsul{
        padding:0;
    }
    .addpicsul li{
        float:left;
        height:80px;
        width:80px;
        margin:5px;
        position:relative;
    }
    .posminus{
        position: absolute;
        right: -5px;
        top: 0;
        /* font-size: 50px; */
    }
    .picsplus{
        margin-top:30px;
    }
    .imgpics{
        height:80px;
        width:80px;
    }
    .minesel{
        float:left;
        width:120px;
        margin-right:5px;
    }
    .secdsel{
        padding:0;
    }
    .secdsel li{
        float:left;
        position:relative;
    }
    .posminus-sel{
        position: absolute;
        top: 0;
        right: -0px;
        /* color: #fff; */
        border-radius: 100%;
        /* background-color: #f00; */
        z-index: 2;
        /* padding: 0 2px; */
        /* font-size: 50px; */
    }
    .posdelall{
        position: absolute;
        right: -0px;
        top: 0px;
        /* font-size: 50px; */
    }
    .onecup{
        float: left;
        position:relative;
        display: inline-block;
    }
    .oowninputwd{
        width:80px;
    }
    .level_2_a{
        padding-left:20px;
    }input.searchinput{
         width:200px;
         display: inline-block;
         margin-right: 15px;
     }
    .modaltable{
        width:100%;
        border:1px solid #ddd;
        border-right: 0;
        border-bottom: 0;
        margin-top: 10px;
    }
    .modaltable thead tr th,
    .modaltable tbody tr td{
        padding:2px 0;
        text-align: center;
        border-right: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
    }
    .edui-default{
        /*z-index: 999!important;*/
    }
    .edui-default .edui-editor{
        z-index: 999!important;
    }


    /*减号显示隐藏*/
    .posminus-sel,.posdelall,.posminus{
        display:none;
    }
</style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content">
    <div class="panel-options">
        <ul class="nav nav-tabs">
            <li class="active"><a data-toggle="tab" href="tabs_panels.html#tab-0"><i class="fa fa-laptop">商品信息</i></a>

            </li>
            <%--<li class=""><a data-toggle="tab" href="tabs_panels.html#tab-1"><i class="fa fa-desktop">支付配置</i></a>--%>
            <%--</li>--%>

        </ul>
    </div>

    <div class="panel-body">
        <form class="form-horizontal" onsubmit="return  false" id="form_brand">
            <input type="hidden" name="pwxgoods.id" value="${twxgoods.id}">
            <input type="hidden" name="pwxgoods.page_type" value="${page_type}">
        <div class="tab-content">
            <div id="tab-0" class="tab-pane active">
                <div class="ibox-content">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">商品名：</label>
                            <div class="col-sm-9">
                                <input type="text" placeholder="" class="form-control" id="pwxgoods_name" name="pwxgoods.name" value="${twxgoods.name}">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">商品图：</label>
                            <div class="col-sm-9">
                                <div class=" col-sm-12 clear">
                                    <ul class="addpicsul picClass" style="float:left;">
                                <c:choose>
                                    <c:when test="${not empty piclist}">
                                        <c:forEach items="${piclist}" var="obj" varStatus="vs">
                                            <li>
                                                <a href="javascript:" class="upload_pic" style="height:80px;">
                                            <input type="file" class="fileInputO" name="fileToUpload"
                                                   id="fileToUpload${obj.id }"
                                                   onChange="uploadFile('fileToUpload${obj.id }','imgUpdate${obj.id }','shopPicId${obj.id }')"/>
                                            <img id="imgUpdate${obj.id }" src="<%=ConfigUtil.get("OSSURL")%>/${obj.path }" width="100%"/>
                                            <input type="hidden" name="pwxgoods.goodsPicId" value="${obj.id }" id="shopPicId${obj.id }"/>
                                                </a>
                                                <i class="fa fa-minus-circle minussapn posminus" onclick="delpic(this);"></i>
                                            </li>
                                        </c:forEach>
                                    </c:when>
                                    <c:otherwise>
                                        <li>
                                            <a href="javascript:" class="upload_pic" style="height:80px;"><input type="file" name="fileToUpload" id="fileToUpload1" onChange="uploadFile('fileToUpload1','imgUpdate1','shopPicId1');">
                                                <img  id="imgUpdate1" src="${OSSURL}/common/plus_72.png" width="100%"/>
                                                <input type="hidden" id="shopPicId1" name="pwxgoods.goodsPicId">
                                            </a>
                                            <i class="fa fa-minus-circle minussapn posminus" onclick="delpic(this);"></i>
                                        </li>
                                    </c:otherwise>
                                </c:choose>
                                    </ul>
                                    <i class="fa fa-plus-circle plussapn picsplus" onclick="picsplus();"></i>
                                </div>
                                <div class="col-sm-12">
                                    <span >*建议图片尺寸 364*362</span>
                                </div>
                            </div>
                        </div>

                    <div class="form-group">
                        <label class="col-sm-3 control-label">价格：</label>
                        <div class=" col-sm-9">
                            <input type="text" id="pwxgoods_price"  name="pwxgoods.price" value="${twxgoods.price}"  placeholder="" class="form-control">
                        </div>
                    </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">商户选择：</label>
                            <div class=" col-sm-9">
                                <select data-placeholder="请选择..." id="pwxgoods_brand" name="pwxgoods.brand" class="chosen-select" style="width:100%" tabindex="0" value="">
                                 
                                </select>
                            </div>
                        </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">开始时间：</label>
                        <div class="col-sm-4">
                            <input id="pwxgoods_startTime" style="width:200px" name="pwxgoods.startTime"  class="form-control layer-date" onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})" type="text" value="${twxgoods.startTime}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">结束时间：</label>
                        <div class="col-sm-4">
                            <input id="pwxgoods_endTime" style="width:200px" name="pwxgoods.endTime"   class="form-control layer-date" onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})" type="text" value="${twxgoods.endTime}">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label">内容：</label>
                        <div class=" col-sm-9">
                            <!-- 加载编辑器的容器 -->
                            <script id="container" name="content" style="height:300px" type="text/plain">
                            </script>
                            <input id="pwxgoods_info" name="pwxgoods.info" type="hidden">
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-3 col-sm-8">
                            <button class="btn btn-primary" onclick="doSubmit();">提交</button>
                            <button id="btn_close1"  class="btn btn-primary" type="button">关闭</button>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        </form>
        </div>
</div>

</body>
    <script src="${ctxStatic}/plugins/h+/js/jquery.min.js?v=2.1.4"></script>

<!-- 配置文件 -->
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/plugins/utf8-jsp/ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/plugins/utf8-jsp/ueditor.all.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/content.min.js?v=1.0.0"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/validate/jquery.validate.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/validate/messages_zh.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/demo/form-validate-demo.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/layer2.4/layer.js"></script>

    <script src="${ctxStatic}/plugins/h+/js/bootstrap.min.js?v=3.3.5"></script>
    <script src="${ctxStatic}/plugins/h+/js/content.min.js?v=1.0.0"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/chosen/chosen.jquery.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/jsKnob/jquery.knob.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/jasny/jasny-bootstrap.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/datapicker/bootstrap-datepicker.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/prettyfile/bootstrap-prettyfile.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/nouslider/jquery.nouislider.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/switchery/switchery.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/ionRangeSlider/ion.rangeSlider.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/iCheck/icheck.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/metisMenu/jquery.metisMenu.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/colorpicker/bootstrap-colorpicker.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/clockpicker/clockpicker.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/plugins/cropper/cropper.min.js"></script>
    <script src="${ctxStatic}/plugins/h+/js/demo/form-advanced-demo.min.js"></script>
<script src="${pageContext.request.contextPath}/resources/plugins/ajaxfileupload.js"></script>
<script src="${ctxStatic}/plugins/h+/js/plugins/layer/laydate/laydate.js"></script>

<script src="${pageContext.request.contextPath}/resources/plugins/ueditor1_4_2-utf8-jsp/ueditor.config.js"></script>
<script src="${pageContext.request.contextPath}/resources/plugins/ueditor1_4_2-utf8-jsp/ueditor.all.min.js"></script>
<script src="${pageContext.request.contextPath}/resources/plugins/ueditor1_4_2-utf8-jsp/lang/zh-cn/zh-cn.js"></script>





<script>
    var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
    var brandId='${twxgoods.brand}';

    <!-- 实例化编辑器 -->
    var ue = UE.getEditor('container');
    <!-- 自定义上传图片-->
    UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
    UE.Editor.prototype.getActionUrl = function(action) {
        if (action == 'uploadimage' || action == 'uploadfile') {
            return '${ctx}/ue/uploadImageForUE.ac';
        } else {
            return this._bkGetActionUrl.call(this, action);
        }
    };

    //对编辑器的操作最好在编辑器ready之后再做
    ue.ready(function() {
        //设置编辑器的内容
        ue.setContent('');
        //获取html内容，返回: <p>hello</p>
        var html = ue.getContent();
        //获取纯文本内容，返回: hello
        var txt = ue.getContentTxt();
        var page_type='${page_type}';
        if(page_type=='update'){
            ue.setContent('${twxgoods.info}');
        }

    });


    loadBrand();
    //加载商户列表
    function  loadBrand() {
        var html='<option value="-1">请选择</option>';
        $.ajax({
            url: "${pageContext.request.contextPath}/mall/loadBrand.ac",
            async: false,
            success: function (data) {
                data = jQuery.parseJSON(data);
                    for(var i=0;i<data.length;i++){
                        html+='<option value="'+data[i].id+'">'+data[i].name+'</option>';
                    }
                    $("#pwxgoods_brand").html(html);
                $('#pwxgoods_brand').chosen({
                    no_results_text : "未找到此选项!",
                    width:"100%"
                });
                if(brandId!=null&&brandId!=''){
                    $("#pwxgoods_brand").val(brandId);
                }
                $("#pwxgoods_brand").trigger("chosen:updated");
            }
        });

    }

    //新增删除上传图片数量
    $(".posminus").on("click",function(){
        $(this).parent().remove();
    });
    function picsplus(){
        var datetime = new Date();
        var fulltime = datetime.getTime();
        var html='<li>'+
                ' <a href="javascript:" class="upload_pic" style="height:80px;"><input type="file" name="fileToUpload" id="fileToUpload'+fulltime+'" onChange="uploadFile(\'fileToUpload'+fulltime+'\',\'imgUpdate'+fulltime+'\',\'shopPicId'+fulltime+'\');">'+
                '    <img  id="imgUpdate'+fulltime+'" src="${OSSURL}/common/plus_72.png" width="100%"/>'+
                '    <input type="hidden" id="shopPicId'+fulltime+'" name="pwxgoods.goodsPicId">'+
                '</a>'+
                '<i class="fa fa-minus-circle minussapn posminus" onclick="delpic(this);"></i>'+
            '</li>';
        $(".picClass").append(html);
        $(".posminus").on("click",function(){
            $(this).parent().remove();
        });

        $(".addpicsul li").hover(function(){
            $(this).find(".posminus ").show();
        },function () {
            $(this).find(".posminus ").hide();
        })
    }

    //新增规格
//    plussin = '<div class="singleobj"><div class="level_1 clear"><div class="onecup"><select class="form-control m-b minesel" name="account"><option>点击选择</option></select><span class="fa fa-minus-circle minussapn delcurobj posdelall" onclick="delobj();"></span></div><span class="newplussapn" onclick="addoption();">新增</span></div>'

    $("#ck").click(function () {
        if ($(this).is(":checked")) {
            $(".picsup").show();
        }
        else {
            $(".picsup").hide();
        }
    })

    function delpic(obj){
        $(obj).parent().remove();
    }
</script>


    <script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
<script type="text/javascript">

    var picPath='<%=ConfigUtil.get("OSSURL")%>';
    var id='${id}';
    //关闭iframe
    $('#btn_close').click(function(){
        parent.layer.close(index);
    });
    //关闭iframe
    $('#btn_close1').click(function(){
        parent.layer.close(index);
    });


    function doSubmit()//提交保存
    {

        var name=$("#pwxgoods_name").val();//名称
//        var shopId=$("#shopPicId1").val();//商品图片
        var brand=$("#pwxgoods_brand").val();//商户编码
        var startTime=$("#pwxgoods_startTime").val();
        var endTime=$("#pwxgoods_endTime").val();
        var container=ue.getContent();//编辑框内容
        $("#pwxgoods_info").val(container);
        var isOk=true;
        if(name==null||name==undefined||name==''){alert("请输入商品名");isOk= false;}
//        if(shopId==null||shopId==undefined||shopId==''){alert("请上传商品图片");isOk= false;}
        if(brand==null||brand==undefined||brand==''||brand=='-1'){alert("请选择商户");isOk= false;}
        if(startTime==null||startTime==undefined||startTime==''){alert("请选择开始时间");isOk= false;}
        if(endTime==null||endTime==undefined||endTime==''){alert("请选择结束时间");isOk= false;}
        if(isOk){
            $.ajax( {
                url:'${pageContext.request.contextPath}/mall/doSave.ac',// 跳转到 action
                data:$("#form_brand").serialize(),
                type:'post',
                cache:false,
                dataType:'json',
                success:function(data) {

                    if(data.isok!="no")
                    {
                        alert(data.msg);
                        parent.reloadTable();
                        parent.layer.close(index);

//                        $(parent).find("iframe[src$='/toMall_lm']").reloadTable();
//                        parent.frames["iframe26"].reloadTable();
                    }else
                    {
                        alert(data.msg);
                    }
                },
                error : function() {
                    alert("操作失败！");
                }
            });
        }else
        {return false;}
    }


    function uploadFile(obj,id,picId){//上传图片
        var labid = "";
        //var detailId = $("#detailId").val();
        //$("#"+id).css("background","url(${pageContext.request.contextPath}/resources/assets/images/waiting.gif) no-repeat 0 0/100% 100%");
        $.ajaxFileUpload({
            url: '${pageContext.request.contextPath}/common/doUploadFile.ac',
            secureuri: false,
            type:'post',
            fileElementId: obj,
            dataType: 'text',
            success: function(data, status) {

                var img=JSON.parse(data);
                $("#"+id).attr("src",picPath+img.path);
                $("#"+picId).val(img.picId);

            },
            error: function(data, status, e) {
                alert(e);
            }
        });
    }
    
    
    $(".onecup").hover(function(){
        $(this).find(".posdelall ").show();
    },function () {
        $(this).find(".posdelall ").hide();
    })
    $(".addpicsul li").hover(function(){
        $(this).find(".posminus ").show();
    },function () {
        $(this).find(".posminus ").hide();
    })
</script>

</html>

